<!--
 * @Author: lp 654528967@qq.com
 * @Date: 2022-05-11 15:28:46
 * @LastEditors: lp 654528967@qq.com
 * @LastEditTime: 2022-06-20 17:34:00
 * @FilePath: \nien-vue3-admin\src\views\myMission\myProcess\runningProcess\index.vue
 * @Description: 运行中任务
-->
<template>
  <div>
    <customContainer :config="config" />
    <Detail
      v-model:visible="visible"
      :title="title"
      :data="data"
      disabled
    ></Detail>
  </div>
</template> 
<script lang='ts' setup>
import { InfoFilled } from '@element-plus/icons-vue'
import { ref, resolveComponent } from 'vue'
import Detail from '@/views/myMission/components/detail.vue'
import { instanceRunList, instanceDetail } from '@/api/myMission/myProcess/runningProcess'
import { approvalHistory } from '@/views/myMission/hooks'

const visible = ref(false), title = ref(''), data = ref({})
const config = {
  query: {
    fields: [
      {
        label: '任务名称',
        prop: 'taskName',
      },
      {
        label: '流程发起人',
        prop: 'taskName',
      },
    ],
    queryParams: {
      pageSize: 10,
      pageNum: 1,
      taskName: undefined,
    },
  },
  table: {
    columns: [
      // { type: 'index', label: '序号', width: '55' },
      { label: '流程发起人', prop: 'initiator' },
      { label: '流程名称', prop: 'processName' },
      { label: '当前环节', prop: 'currTaskName' },
      { label: '开始时间', prop: 'startTime' },
      { label: '流程状态', prop: 'processStatus' },
      { label: '流程标识Key', prop: 'businessKey' },
      { label: '版本号', prop: 'version' },
      {
        label: '操作',
        className: 'custormFixedCol',
        showOverflowTooltip: false,
        fixed: 'right',
        minWidth: '120',
        render(h, { row }) {
          return [
            h(resolveComponent('el-popconfirm'), {
              confirmButtonText: '确认',
              cancelButtonText: '取消',
              icon: InfoFilled,
              title: '您确定作废【这个还没写】吗？',
              onConfirm: () => {
                console.log('queding')
              },
              onCancel: () => {
                console.log('quxiao')
              },
            }, {
              reference: () => h(resolveComponent('ElButton'), {
                onClick: () => {
                  console.log(row)
                },
                text: true,
                type: 'primary',
              }, () => '作废'),
            }),
            h(resolveComponent('ElButton'), {
              onClick: async () => {
                title.value = '审批历史'
                const { data: resData } = await approvalHistory({ row, visible, api: instanceDetail, key: 'processInstanceId' })
                data.value = resData
              },
              text: true,
              loading: row.loading,
              type: 'primary',
            }, () => '审批历史'),
          ]
        },
      },
    ],
    // event: {
    //   onRowClick(e) {
    //     console.log(e)
    //   },
    // },
  },
  api: instanceRunList,
  // requestTrans: (q) => {
  //   console.log(q)
  //   return q
  // },
  customKey: 'myMission/personalTasks/toDoTasks',
}
</script>

<script lang="ts">
export default {
  name: 'RunningProcess',
}
</script>